/*
 * @Author       : helishou
 * @Date         : 2021-05-17 09:08:33
 * @LastEditTime : 2021-06-23 15:00:46
 * @LastEditors  : helishou
 * @Description  : 提取css
 * @FilePath     : \webpack入门\生产环境\9-提取csss成单独文件\webpack.config.js
 * 你用你的指尖,阻止我说再见,在bug完全失去之前
 */
const {
  resolve,
} = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

// 设置nodejs环境变量
// process.env.NODE_ENV = 'development';

module.exports = {
  entry: './src/js/index.js',
  output: {
    filename: 'js/built.js',
    path: resolve(__dirname, 'build'),
  },
  module: {
    rules: [{
      test: /\.css$/,
      use: [
        MiniCssExtractPlugin.loader,
        'css-loader',
      ],
    }],
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: './src/index.html',
    }),
    new MiniCssExtractPlugin({
      filename: 'css/[name].[hash].css',
    }),
  ],
  mode: 'development',
};
